<br/>
<!--<div class="col-sm-12">
	<div class="panel panel-default" id="charts_env">
		<div class="panel-heading" style="border:1px solid #cecece;height:42px"><div class="panel-title">实时销量</div></div>
		<div class="panel-body">
			<form class="chart-filter" method="POST" action="stats/realtime_profit" render="realtimeProfit" style="border:0;padding:0">
				<input type="hidden" name="start" value="<?php echo date('Y-m-d')?>">
				<input type="hidden" name="end" value="<?php echo date('Y-m-d')?>">
			</form>
			<div id="realtimeChart" style="margin:15px"></div>
		</div>
	</div>
</div>
<div class="clearfix"></div><br/>-->
<div class="col-sm-6 fadein-left">
	<div class="panel panel-default" id="charts_env">
		<div class="panel-heading" style="border:1px solid #cecece;height:42px"><div class="panel-title">营业总额</div></div>
		<div class="panel-body">
			<form class="chart-filter" method="POST" action="stats/all_profit" render="allProfit">
				开始日期： <input onclick="laydate()" name="start" value="<?php echo date('Y-m-01')?>">
				结束日期： <input onclick="laydate()" name="end" value="<?php echo date('Y-m-d')?>">
				<button class="btn btn-danger">查询</button>
			</form>
			<div id="areaChart" style="margin:15px"></div>
		</div>
	</div>
</div>
<div class="col-sm-6 fadein-right">
	<div class="panel panel-default" id="charts_env">
		<div class="panel-heading" style="border:1px solid #cecece;height:42px"><div class="panel-title">各端营业总额</div></div>
		<div class="panel-body">
			<form class="chart-filter" method="POST" action="stats/plat_profit" render="platProfit">
				开始日期： <input onclick="laydate()" name="start" value="<?php echo date('Y-m-01')?>">
				结束日期： <input onclick="laydate()" name="end" value="<?php echo date('Y-m-d')?>">
				<button class="btn btn-danger">查询</button>
			</form>
			<div id="areaChart2" style="margin:15px"></div>
		</div>
	</div>
</div>
<div class="clearfix"></div><br/>
<div class="col-sm-6 fadein-left">
	<div class="panel panel-default" id="charts_env">
		<div class="panel-heading" style="border:1px solid #cecece;height:42px"><div class="panel-title">各端营业比例</div></div>
		<div class="panel-body">
			<form class="chart-filter" method="POST" action="stats/plat_percentage" render="renderPencentage">
				开始日期： <input onclick="laydate()" name="start" value="<?php echo date('Y-m-01')?>">
				结束日期： <input onclick="laydate()" name="end" value="<?php echo date('Y-m-d')?>">
				<button class="btn btn-danger">查询</button>
			</form>
			<div id="pie" style="margin:15px"></div>
		</div>
	</div>
</div>
<div class="col-sm-6 fadein-right">
	<div class="panel panel-default" id="charts_env">
		<div class="panel-heading" style="border:1px solid #cecece;height:42px"><div class="panel-title">订单概况</div></div>
		<div class="panel-body">
			<form class="chart-filter" method="POST" action="stats/status_percentage" render="statusPencentage">
				开始日期： <input onclick="laydate()" name="start" value="<?php echo date('Y-m-01')?>">
				结束日期： <input onclick="laydate()" name="end" value="<?php echo date('Y-m-d')?>">
				<button class="btn btn-danger">查询</button>
			</form>
			<div id="pie2" style="margin:15px"></div>
		</div>
	</div>
</div>
<div class="clearfix"></div><br/>
<style>
.chart-filter{padding:8px;border-bottom:1px solid #cecece}
.chart-filter input{border:1px solid #cecece;border-radius:3px;padding:4px;height:32px;margin-right:10px;display:inline-block}
.highcharts-title{font-family:"Microsoft Yahei";}
</style>
<script>
//各端营业额
function renderPencentage(c){
	$('#pie').highcharts({
		chart: {type: 'pie',options3d: {enabled: true,alpha: 45,beta: 0}},
		title: {text: '各端营业额所占比例'},
		tooltip: {pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'},
		plotOptions: {pie: {allowPointSelect: true,cursor: 'pointer',depth: 35,dataLabels: {enabled: true,format: '{point.name}'}}},
		series: [{type: 'pie',name: '营业额',data: c}]
	});
}
//订单概况
function statusPencentage(c){
	$('#pie2').highcharts({
		chart: {type: 'pie',options3d: {enabled: true,alpha: 45}},
		title: {text: '订单概况'},
		plotOptions: {pie: {innerSize: 100,depth: 45}},
		series: [{name: '数量',data: c}]
	});
}
//营业总额
function allProfit(c){
	$('#areaChart').highcharts({
		chart: {type: 'areaspline'},
        title: {text: '历史营业额统计'},
        xAxis:{type: 'datetime',labels: {step: 2},dateTimeLabelFormats:{
			second: '%H:%M:%S',
			minute: '%H:%M',
			hour: '%b-%e %H:%M',
			day: '%Y-%m-%d', 
			week: '%Y-%m-%d', 
			month: '%Y-%m-%d', 
			year: '%Y-%m-%d'
		}},
		legend:{enabled:false},
        yAxis: {title:{text: '营业额'}},
        series: [{name: '营业额',data: c}]
    });
}
//各端营业总额
function platProfit(c){
	$('#areaChart2').highcharts({
		chart: {type: 'areaspline'},
        title: {text: '历史营业额统计'},
        xAxis:{type: 'datetime',labels: {step: 2},dateTimeLabelFormats:{
			second: '%H:%M:%S',
			minute: '%H:%M',
			hour: '%b-%e %H:%M',
			day: '%Y-%m-%d', 
			week: '%Y-%m-%d', 
			month: '%Y-%m-%d', 
			year: '%Y-%m-%d'
		}},
        yAxis: {title:{text: '营业额'}},
        series: c
    });
}
//实时销量
function realtimeProfit(c){
	$('#realtimeChart').highcharts({
		chart: {
			type: 'areaspline',
			events: {
				load:function(){
					setInterval(function(){
						$.post('stats/realtime_profit', $('.chart-filter:first').serialize(),function(c){
							$.each(c,function(i,d){
								var series = this.series[i];
								$.each(d.data,function(k,s){
									series.addPoint([s[0], s[1]], true, true);
								});
							});
						},'JSON');
					}, 20000); //20秒后更新一次
				}
			}
		},
        title: {text: '实时销量统计'},
        xAxis:{type: 'datetime',labels: {step: 2},dateTimeLabelFormats:{
			second: '%H:%M:%S',
			minute: '%H:%M',
			hour: '%b-%e %H:%M',
			day: '%Y-%m-%d', 
			week: '%Y-%m-%d', 
			month: '%Y-%m-%d', 
			year: '%Y-%m-%d'
		}},
        yAxis: {title:{text: '营业额'}},
        series: c
    });
}
$('form.chart-filter').submit(function(event){
	event.preventDefault();
	if($(this).find('[name=start]').val()==''||$(this).find('[name=end]').val()==''){Core.error('请选择开始日期和结束日期');return}
	var $this=$(this);
	$.post($(this).attr('action'),$(this).serialize(),function(c){
		eval($this.attr('render')+'(c)');
	},'JSON');
}).submit();
</script>